<template>
    <div class='app-manage-container'>
      <!-- <HelloWorld :message="'yeqiang'"></HelloWorld> -->
      <el-form :inline="true"
               :model="requestParam"
               label-width="120px">
        <el-form-item label="应用名称"
                      prop="app_name">
          <el-input v-model="requestParam.app_name"
                    placeholder="请输入应用名称">
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-button @click="search"
                     type="primary">
            搜索
          </el-button>
        </el-form-item>
      </el-form>
      <el-table :data="appList.list"
                height="600">
        <el-table-column label="应用名称"
                         prop="app_name">
        </el-table-column>
        <el-table-column label="应用说明"
                         prop="app_des">
        </el-table-column>
        <el-table-column label="应用分类"
                         prop="app_group_name">
        </el-table-column>
        <el-table-column label="应用类型"
                         prop="app_endpoint_name">
        </el-table-column>
        <el-table-column label="操作"
                         prop="">
          <template slot-scope="scope">
            <el-button @click="assignApp(scope.row)"
                       type="text">分配</el-button>
            <el-button type="text"
                       @click="deleteAssign(scope.row)">授权</el-button>
            <el-button @click="publishApp(scope.row)"
                       type="text">修改</el-button>
            <el-button @click="deleteApp(scope.row)"
                       type="text">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination id="pagination"
                     @current-change="handleCurrentChange"
                     :current-page="requestParam.page"
                     :page-size="requestParam.page_size"
                     background
                     align="center"
                     layout="total,sizes,prev, pager, next, jumper"
                     :total="appList.total_count">
      </el-pagination>
      <EditAppDialog :dialogVisible.sync="publishAppDialogVisible"
                     :dialogForm="publishAppDialogForm"
                     @callback="publishAppCb"></EditAppDialog>
      <CompanyListDialog @choose="chooseCompanyCb"
                         :chooseType="'selection'"
                         :dialogVisible.sync="chooseCompanyDialogVisible"></CompanyListDialog>
    </div>
  </template>
  <script>
  import { AppApi } from '@/services/settingManage'
  import { standardCodeApi } from '@/services/StandardCode'
  import CompanyListDialog from '@/components/CompanySelect/components/CompanyListDialog'
  import EditAppDialog from './components/EditAppDialog'
  // import { HelloWorld } from 'yeqiang-test-npm'
  // import { test } from 'yeqiang-test-npm'
  
  export default {
    data () {
      return {
        requestParam: {
          page: 1,
          per_page: 10,
          app_name: '',
          order: 'app_id desc'
        },
        appList: {
          list: [],
          page: 1,
          total_count: 0,
        },
        // 应用端标准码
        appEndPoint: [],
        // 应用端标准码map
        appEndPointMap: new Map(),
        // 应用分组标准码
        appGroup: [],
        // 应用分组标准码map
        appGroupMap: new Map(),
        // 选择公司弹框是否可见
        chooseCompanyDialogVisible: false,
        // 当前选择分配的应用
        choosedApp: {},
        // 发布app弹框是否可见
        publishAppDialogVisible: false,
        // 发布app弹框数据对象
        publishAppDialogForm: {}
      }
    },
    components: {
      CompanyListDialog,
      EditAppDialog,
      // HelloWorld
    },
    methods: {
      // 发布app
      publishApp (data) {
        console.log(data);
        this.publishAppDialogForm = data
        this.publishAppDialogVisible = true
      },
      // 发布app回调
      publishAppCb (data) {
        this.getAppList()
      },
      handleCurrentChange (page) {
        this.requestParam.page = page
        this.getAppList()
      },
      // 删除app确认
      deleteApp (row) {
        this.$confirm('此操作将永久删除, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.deleteAppApi(row.app_id)
        }).catch(() => {
  
        })
      },
      // 删除app api(改)
      deleteAppApi (id) {
        AppApi.deleteApp({
          data: {
            app_id: id
          }
        }).then(res => {
          if (res.code === 0) {
            this.$message.success('删除应用成功')
            this.getAppList()
          }
        })
      },
      // 取消分配
      deleteAssign (row) {
        this.$router.push({
          path: '/assignAppList',
          query: {
            appId: row.app_id
          }
        })
      },
      // 选择公司弹框回调
      chooseCompanyCb (data) {
        let auths = []
        data.map((item) => {
          auths.push({
            object_type: '1',
            object_id: item.company_id,
            app_id: this.choosedApp.app_id,
            company_id: item.company_id,
            show: '1'
          })
        })
        AppApi.assignApp({
          data: auths
        }).then(res => {
          if (res.code === 0) {
            this.$message.success('分配应用成功')
          }
        })
      },
      assignApp (row) {
        this.choosedApp = row
        this.chooseCompanyDialogVisible = true
      },
      search () {
        this.getAppList()
      },
      handlePageChange (page) {
        this.requestParam.page = page
        this.getAppList()
      },
      // 获取应用列表
      getAppList () {
        AppApi.getAppList({
          params: this.requestParam
        }).then(res => {
          if (res.code === 0) {
            this.appList = res.data
            this.appList.list.map((item) => {
              let appGroup = this.appGroupMap.get(item.app_group) || {}
              let appEndPoint = this.appEndPointMap.get(item.app_endpoint) || {}
              item.app_group_name = appGroup.name
              item.app_endpoint_name = appEndPoint.name
            })
          }
        })
      },
      // 获取应用端标准码
      getAppEndPointCode () {
         return standardCodeApi.getCodeNoToken({
          data: {
            code_type: "applicaitonEndpoint",
            system_no: "ass",
            no_token: "1"
          }
        }).then(res => {
          if (res.code === 0) {
            this.appEndPoint = res.data.list
            this.convertCodeListToMap(this.appEndPointMap, this.appEndPoint)
            window.localStorage.setItem('applicaitonEndpoint', JSON.stringify(res.data.list))
          }
        })
       
      },
      // 获取应用分组标准码
      getAppGroupCode () {
        return standardCodeApi.getCodeNoToken({
          data: {
            code_type: 'applicationGroup',
            system_no: "ass",
            no_token: "1"
          }
        }).then(res => {
          if (res.code === 0) {
            this.appGroup = res.data.list
            this.convertCodeListToMap(this.appGroupMap, this.appGroup)
            window.localStorage.setItem('applicationGroup', JSON.stringify(res.data.list))
          }
        })
      },
      // 将标准码列表转换为map
      convertCodeListToMap (map, codeList) {
        if(codeList){
          codeList.map((item) => {
          map.set(item.value, item)
        })
        }
       
      },
      getAppEndPointCode () {
      return standardCodeApi.getCodeNoToken({
        data: {
          code_type: 'applicaitonEndpoint',
          system_no: "ass",
          no_token: "1"
        }
      }).then(res => {
        if (res.code === 0) {
          this.appEndPoint = res.data.list
          this.convertCodeListToMap(this.appEndPointMap, this.appEndPoint)
          window.localStorage.setItem('applicaitonEndpoint', JSON.stringify(res.data.list))
        }
      })
    },
    },
    async created () {
      this.appEndPoint=[];
      let endPointLocal = window.localStorage.getItem('applicaitonEndpoint')
      if(endPointLocal){
       this.appEndPoint=JSON.parse(endPointLocal)
      }else{
        await this.getAppEndPointCode() //应用分类标准码
      }
      // let groupLocal = window.localStorage.getItem('applicationGroup')
      if (endPointLocal) {
        // console.log(this.appEndPointMap, this.appEndPoint,1111111);
        this.appEndPoint = JSON.parse(endPointLocal)
        this.convertCodeListToMap(this.appEndPointMap, this.appEndPoint)
      } else {
        await this.getAppEndPointCode()
      }
     
      await this.getAppGroupCode()
      // if (groupLocal) {
      //   this.appGroup = JSON.parse(groupLocal)
      //   this.convertCodeListToMap(this.appGroupMap, this.appGroup)
      // } else {
  
      // }
  
      this.getAppList()
    },
    mounted () {
    }
  }
  </script>
  <style scoped lang='scss'>
  .app-manage-container {
    padding: 20px;
    background-color: #fff;
    height: 100%;
    .el-pagination {
      margin-top: 20px;
    }
  }
  </style>